<template>
  <div id="resource_manage" class="container">
    <div class="content">
      <!-- <div class="title">资源管理</div> -->
      <div class="panel">
        <div>
          <table class="table" cellspacing="0">
            <thead class="thead">
              <tr>
                <td style="width: 10rem;">名称</td>
                <td style="width: 4rem;">发布单位</td>
                <td style="width: 2rem;">种类</td>
                <td style="width: 2rem;">添加时间</td>
                <td style="width: 2rem;">操作</td>
              </tr>
            </thead>
            <tbody class="tbody">
              <tr v-for="item,index in resourceList">
                <td>
                  <div style="display: flex;justify-content: center;align-items: center;">
                    <div style="margin-right:0.05rem">{{item.resourceName}}</div>
                    <div v-if="item.resourceAttributionType == 1" class="name_img_org"></div>
                    <div v-else class="name_img_sch"></div>
                  </div>
                </td>
                <td>{{item.resourceAttributionName}}</td>
                <td>{{item.resourceType == 1 ?'文件夹':"文件"}}</td>
                <td>{{item.createTime}}</td>
                <td @click="gotoSyllabus(item)">
                  <div class="syllabusRes" v-if="hasPage('41')">详情</div>
                </td>
              </tr>
            </tbody>
          </table>
        </div>
        <el-pagination
          class="page"
          layout="total, sizes, prev, pager, next, jumper"
          :current-page="tabledisplayObj.currPage"
          @size-change="pageSizeChange"
          @current-change="tabledisplayChangePage"
          :total="tabledisplayObj.total"
        ></el-pagination>
      </div>
    </div>
  </div>
</template>

<script>
let vm;
let user;
export default {
  data() {
    return {
      resourceList: [],
      tabledisplayObj: {
        currPage: 1,
        pageSize: 10,
        total: 0,
        campusId: "",
      }
    };
  },
  components: {},
  methods: {
    campusChange: function(campusId) {
      vm.tabledisplayObj.campusId = campusId;
      this.initData();
    },
    pageSizeChange: function(val) {
      //页条数发生改变
      vm.tabledisplayObj.pageSize = val;
      this.initData();
    },
    /**表格显示形式翻页 */
    tabledisplayChangePage(val) {
      console.log(val);
      vm.tabledisplayObj.currPage = val;
      this.initData();
    },
    /**进入课节文件夹
     * @param {Object} item 课程
     */
    gotoSyllabus(item) {
      var path = vm.$store.state.permit["41"].path;
      //传递参数
      vm.$router.push({
        path: path,
        query: {
          resourceId: tool.encode(item.resourceId),
          title: tool.encode(item.resourceName)
        }
      });
    },
    /**
     * 初始化数据
     */
    initData() {
      vm.tabledisplayObj.campusId = vm.$store.state.campusId;
      api.getListPageOfOneLevel(vm.tabledisplayObj).then(function(data) {
        console.log(data);
        if (data.resultCode == 2000) {
          data.list.forEach(item => {
            item.createTime = item.createTime.split(" ")[0];
          });
          vm.tabledisplayObj.total = data.totalCount;
          vm.resourceList = data.list;
        } else {
          vm.$message.error(data.message);
        }
      });
    }
  },
  mounted() {
    vm = this;
    user = tool.getItem(lsKey.user, true); //得到当前用户信息
    vm.initData();
  },
  computed: {}
};
</script>

<style lang="scss">
#resource_manage {
  .el-input__inner {
    border-radius: 0.08rem;
    font-size: 0.16rem;
    color: #666666;
    height: 0.36rem;
    line-height: 0.36rem;
  }

  .el-input__icon {
    line-height: 0.36rem;
  }

  .input_search {
    .el-input__inner {
      background-color: rgb(247, 248, 250);
    }
  }

  .syllabusRes {
    text-decoration: underline;
    color: #3885f8;
    font-size: 0.16rem;
    cursor: pointer;
  }
  .name_img_org {
    margin-right: 0.04rem;
    width: 0.42rem;
    height: 0.26rem;
    background-image: url(../../assets/img/common/mechanism.png);
  }
  .name_img_sch {
    margin-right: 0.04rem;
    width: 0.42rem;
    height: 0.26rem;
    background-image: url(../../assets/img/common/school.png);
  }
}
</style>
<style scoped src="@/style/module/table.css"></style>
<style scoped src="@/style/clue_manage/clue_manage.css"></style>
<style scoped>
.right_btn {
  background-image: url(../../assets/img/clue_manage/add_white.png);
  width: 1.54rem;
}
</style>
